// credits/components/query-condition/index.js
import { formatDate } from '../../../utils/util'

Component({
    options: {
        addGlobalClass: true,
    },

    /**
     * 组件的属性列表
     */
    properties: {
    },

    /**
     * 组件的初始数据
     */
    data: {
        params: {
            name: '',
            model_number: '',
            startDate: '',
            endDate: ''
        },
        dateShow: false,
        isStart: false,
        minDate: null,
        maxDate: null,
        modelShow: false,
        modelNameList: []
    },

    /**
     * 组件的方法列表
     */
    methods: {
        requestModel() {
            this.data.modelList = new Array(50).fill(1).map((item, index) => {
                return {value: index + 1, label: '测试模型' + (index + 1)}
            })
            this.setData({
                modelNameList: this.data.modelList.map((item) => item.label)
            })
        },
        updateParams(field, value) {
            clearTimeout(this.timer);
            this.timer = setTimeout(() => {
                this.triggerEvent('change', {
                    field,
                    value,
                    params: this.data.params
                })
            }, 600);
        },
        onNameInput(event) {
            this.setData({
                'params.name': event.detail.value
            }, () => {
                this.updateParams('name', event.detail.value)
            })
        },
        onModelInput() {
            this.setData({
                'params.model_number': event.detail.value
            }, () => {
                this.updateParams('model_number', event.detail.value)
            })
        },
        // onModelClick() {
        //     this.setData({
        //         modelShow: true
        //     })
        // },
        onStartClick() {
            const { startDate, endDate } = this.data.params
            this.setData({
                dateShow: true,
                isStart: true,
                currentDate: startDate ? new Date(startDate).getTime() : endDate ? new Date(endDate).getTime() : Date.now(),
                minDate: new Date('1970-01-01').getTime(),
                maxDate: endDate ? new Date(endDate).getTime() : new Date('2100-12-31').getTime()
            })
        },
        onEndClick() {
            const { startDate, endDate } = this.data.params
            this.setData({
                dateShow: true,
                isStart: false,
                currentDate: endDate ? new Date(endDate).getTime() : startDate ? new Date(startDate).getTime() : Date.now(),
                minDate: startDate ? new Date(startDate).getTime() : new Date('1970-01-01').getTime(),
                maxDate: endDate ? new Date(endDate).getTime() : new Date('2100-12-31').getTime()
            })
        },
        onDateConfirm(event) {
            let field = this.data.isStart ? 'startDate' : 'endDate'
            let value = formatDate(new Date(event.detail), '-')
            this.setData({
                [`params.${field}`]: value
            }, () => {
                this.updateParams(field, value)
            })
        },
        onDateClose() {
            this.setData({
                dateShow: false,
            })
        },
        onModelConfirm(event) {
            const {value, index} = event.detail
            const model = this.data.modelList[index].value
            this.setData({
                'params.modelName': value,
                'params.model': model
            }, () => {
                this.updateParams('model', model)
            })
        },
        onModelClose() {
            this.setData({
                modelShow: false,
            })
        }
    },
    lifetimes: {
        attached: function () {
            this.timer = null
            this.requestModel()
        },
        detached: function () {
            // 在组件实例被从页面节点树移除时执行
        },
    },
})